<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
	xmlns:h="http://xmlns.jcp.org/jsf/html"
	xmlns:f="http://xmlns.jcp.org/jsf/core"
	xmlns:jsf="http://xmlns.jcp.org/jsf"
	xmlns:pt="http://xmlns.jcp.org/jsf/passthrough"
	xmlns:p="http://primefaces.org/ui">

<f:view>
	<f:metadata>
		<f:viewAction action="#{menuMB.updateMenu(1)}" />
	</f:metadata>

	<ui:composition template="/WEB-INF/templates/defaultLayout.xhtml">

		<!-- Definiendo la cabecera de la pagina -->
		<ui:define name="title">
			<h:outputText value="Apertura Cta. Aporte" />
		</ui:define>

		<!-- Definiendo el cuerpo de la pagina -->
		<ui:define name="content">

			<h:outputStylesheet library="css" name="main.css" />
			<div>
				<br />
				<div style="margin-left: 50px;">
					<div>
						<div>
							<div class="p6n-api-consent-screen-title">APERTURA DE
								CUENTA APORTE</div>
							<div class="p6n-api-consent-screen-inputs" style="float: none;">
								<div class="p6n-api-consent-screen-input-section">
									<div class="p6n-api-consent-screen-label" style="width: 150px;">
										TIPO DE PERSONA</div>
									<div>
										<h:form>
											<p:focus for="cmbTipopersona"/>
											<h:selectOneMenu id="cmbTipopersona"
												value="#{aperturaCuentaaporteBean.comboTipopersona.itemSelected}"
												valueChangeListener="#{aperturaCuentaaporteBean.changeTipopersona}"
												required="true" requiredMessage="Seleccione tipo de persona">
												<f:selectItems
													value="#{aperturaCuentaaporteBean.comboTipopersona.items.entrySet()}"
													var="val" itemLabel="#{val.value}" itemValue="#{val.key}" />
												<f:ajax
													render=":persona :formPersonaNatural :formPersonaJuridica"
													execute="@form"></f:ajax>
											</h:selectOneMenu>
										</h:form>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<h:panelGroup id="persona">
					<h:form id="formPersonaNatural">
						<h:panelGroup id="panelGroupPersonanatural"
							rendered="#{aperturaCuentaaporteBean.personanatural}">
							<br />
							<div>
								<div style="margin-left: 50px;">
									<div>
										<div>
											<div class="p6n-api-consent-screen-title">PERSONA
												NATURAL</div>
											<div class="p6n-api-consent-screen-inputs">
												<div class="sf-separator">
													<h3 class="p6n-api-consent-screen-title"
														style="color: #298B11;">Datos Generales</h3>
												</div>
												<div class="p6n-api-consent-screen-input-section">
													<div style="display: inline-block; width: 190px;">
														<div class="p6n-api-consent-screen-label">TIPO
															DOCUMENTO</div>
														<div>
															<h:selectOneMenu id="cmbTipodocumento"
																value="#{aperturaCuentaaporteBean.comboTipodocumentoPersonanatural.itemSelected}"
																valueChangeListener="#{aperturaCuentaaporteBean.changeTipodocumentoPersonanatural}"
																required="true"
																requiredMessage="Seleccione tipo de documento">
																<f:selectItem itemLabel="--SELECCIONE--" itemValue="" />
																<f:selectItems
																	value="#{aperturaCuentaaporteBean.comboTipodocumentoPersonanatural.items.entrySet()}"
																	var="val" itemLabel="#{val.value.abreviatura}"
																	itemValue="#{val.key}" />
																<f:ajax></f:ajax>
															</h:selectOneMenu>
														</div>
													</div>
													<div style="display: inline-block; width: 190px;">
														<div class="p6n-api-consent-screen-label">NUMERO
															DOCUMENTO</div>
														<div>
															<h:inputText id="txtDni" autocomplete="off"
																value="#{aperturaCuentaaporteBean.numeroDocumentoPersonanatural}"
																required="true" maxlength="14"
																requiredMessage="Ingrese numero documento"
																validatorMessage="Número de DNI Invalido">
																<f:ajax event="blur"
																	listener="#{aperturaCuentaaporteBean.buscarPersonanaturalSocio()}"
																	render="txtApellidoPaterno txtApellidoMaterno txtNombres cmbSexo txtFechanacimiento cmbEstadocivil txtOcupacion txtDireccion txtReferencia txtTelefono txtCelular txtEmail"></f:ajax>
															</h:inputText>
														</div>
													</div>
												</div>
												<div
													class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
													<h:message for="cmbTipodocumento" />
													<h:message for="txtDni" />
												</div>
												<div class="p6n-api-consent-screen-input-section">
													<div style="display: inline-block; width: 190px;">
														<div class="p6n-api-consent-screen-label">APELLIDO
															PATERNO</div>
														<div>
															<div>
																<h:inputText id="txtApellidoPaterno" autocomplete="off"
																	value="#{aperturaCuentaaporteBean.apellidoPaterno}"
																	required="true" maxlength="50"
																	requiredMessage="Ingrese apellido paterno"
																	onkeyup="this.value = this.value.toUpperCase();">
																</h:inputText>
															</div>
														</div>
													</div>
													<div style="display: inline-block;">
														<div class="p6n-api-consent-screen-label">APELLIDO
															MATERNO</div>
														<div>
															<div>
																<h:inputText id="txtApellidoMaterno" autocomplete="off"
																	value="#{aperturaCuentaaporteBean.apellidoMaterno}"
																	required="true" maxlength="50"
																	requiredMessage="Ingrese apellido materno"
																	onkeyup="this.value = this.value.toUpperCase();">
																</h:inputText>
															</div>
														</div>
													</div>
												</div>
												<div
													class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
													<h:message for="txtApellidoPaterno" />
													<h:message for="txtApellidoMaterno" />
												</div>
												<div class="p6n-api-consent-screen-input-section">
													<div class="p6n-api-consent-screen-label">NOMBRES</div>
													<div>
														<div>
															<h:inputText id="txtNombres" autocomplete="off"
																value="#{aperturaCuentaaporteBean.nombres}"
																required="true" maxlength="50"
																requiredMessage="Ingrese nombres"
																onkeyup="this.value = this.value.toUpperCase();"
																style="width:339px;">
															</h:inputText>
														</div>
													</div>
												</div>
												<div
													class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
													<h:message for="txtNombres" />
												</div>
												<div class="p6n-api-consent-screen-input-section">
													<div style="display: inline-block; width: 190px;">
														<div class="p6n-api-consent-screen-label">SEXO</div>
														<div>
															<div>
																<h:selectOneMenu id="cmbSexo"
																	value="#{aperturaCuentaaporteBean.comboSexo.itemSelected}"
																	required="true" requiredMessage="Seleccione sexo">
																	<f:selectItem itemLabel="--Seleccione--" itemValue="" />
																	<f:selectItems
																		value="#{aperturaCuentaaporteBean.comboSexo.items.entrySet()}"
																		var="val" itemLabel="#{val.value.denominacion}"
																		itemValue="#{val.key}" />
																</h:selectOneMenu>
															</div>
														</div>
													</div>
													<div style="display: inline-block;">
														<div class="p6n-api-consent-screen-label">FECHA DE
															NACIMIENTO</div>
														<div>
															<div>
																<p:calendar id="txtFechanacimiento" autocomplete="off"
																	value="#{aperturaCuentaaporteBean.fechaNacimiento}"
																	navigator="true" pattern="dd/MM/yyyy" required="true"
																	requiredMessage="Ingrese fecha de nacimiento"
																	converterMessage="formato incorrecto">
																	<f:convertDateTime pattern="dd/MM/yy" timeZone="EST" />
																</p:calendar>
															</div>
														</div>
													</div>
												</div>
												<div
													class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
													<h:message for="cmbSexo" />
													<h:message for="txtFechanacimiento" />
												</div>
												<br />
												<div class="sf-separator">
													<h3 class="p6n-api-consent-screen-title"
														style="color: #298B11;">Datos Adicionales</h3>
												</div>
												<div class="p6n-api-consent-screen-input-section">
													<div class="p6n-api-consent-screen-label">ESTADO
														CIVIL</div>
													<div>
														<div style="display: inline-block; width: 190px;">
															<div>
																<h:selectOneMenu id="cmbEstadocivil"
																	value="#{aperturaCuentaaporteBean.comboEstadocivil.itemSelected}">
																	<f:selectItem itemLabel="--Seleccione--" itemValue="" />
																	<f:selectItems
																		value="#{aperturaCuentaaporteBean.comboEstadocivil.items.entrySet()}"
																		var="val" itemLabel="#{val.value.denominacion}"
																		itemValue="#{val.key}" />
																</h:selectOneMenu>
															</div>
														</div>
														<div style="display: inline-block;">
															<div class="p6n-api-consent-screen-label">OCUPACION</div>
															<div>
																<div>
																	<h:inputText id="txtOcupacion" autocomplete="off"
																		onkeyup="this.value = this.value.toUpperCase();"
																		value="#{aperturaCuentaaporteBean.ocupacion}" />
																</div>
															</div>
														</div>
													</div>
												</div>
												<div class="p6n-api-consent-screen-input-section">
													<div style="display: inline-block; width: 190px;">
														<div class="p6n-api-consent-screen-label">DIRECCION</div>
														<div>
															<div>
																<h:inputText id="txtDireccion" autocomplete="off"
																	value="#{aperturaCuentaaporteBean.direccionPersonanatural}"
																	onkeyup="this.value = this.value.toUpperCase();">
																</h:inputText>
															</div>
														</div>
													</div>
													<div style="display: inline-block;">
														<div class="p6n-api-consent-screen-label">REFERENCIA</div>
														<div>
															<div>
																<h:inputText id="txtReferencia" autocomplete="off"
																	value="#{aperturaCuentaaporteBean.referenciaPersonanatural}"
																	onkeyup="this.value = this.value.toUpperCase();">
																</h:inputText>
															</div>
														</div>
													</div>
												</div>
												<div class="p6n-api-consent-screen-input-section">
													<div style="display: inline-block; width: 190px;">
														<div class="p6n-api-consent-screen-label">TELEFONO</div>
														<div>
															<div>
																<h:inputText id="txtTelefono" autocomplete="off"
																	value="#{aperturaCuentaaporteBean.telefonoPersonanatural}">
																</h:inputText>
															</div>
														</div>
													</div>
													<div style="display: inline-block;">
														<div class="p6n-api-consent-screen-label">CELULAR</div>
														<div>
															<div>
																<h:inputText id="txtCelular" autocomplete="off"
																	value="#{aperturaCuentaaporteBean.celularPersonanatural}">
																</h:inputText>
															</div>
														</div>
													</div>
												</div>
												<div class="p6n-api-consent-screen-input-section">
													<div class="p6n-api-consent-screen-label">EMAIL</div>
													<div>
														<div>
															<h:inputText id="txtEmail" autocomplete="off"
																onkeyup="this.value = this.value.toUpperCase();"
																value="#{aperturaCuentaaporteBean.emailPersonanatural}"
																style="width:339px;" />
														</div>
													</div>
												</div>
												<br />
												<div class="sf-buttons" style="float: left;">
													<h:commandButton value="Cancelar"
														action="/caja/index?faces-redirect=true"
														immediate="true" styleClass="action" />
													<h:commandButton value="Siguiente »"
														action="aperturaCuentaaporte-flowA.xhtml"
														styleClass="action green" />
												</div>
											</div>
										</div>
									</div>
								</div>
							</div>
						</h:panelGroup>
					</h:form>
					<br></br>
					<h:panelGroup id="panelGroupPersonajuridica"
						rendered="#{aperturaCuentaaporteBean.personajuridica}">
						<div>
							<h:form id="formPersonaJuridica">
								<div style="margin-left: 50px;">
									<div>
										<div>
											<div class="p6n-api-consent-screen-title">PERSONA
												JURIDICA</div>
											<div class="p6n-api-consent-screen-inputs">
												<div class="sf-separator">
													<h3 class="p6n-api-consent-screen-title"
														style="color: #298B11;">Datos Generales</h3>
												</div>
												<div class="p6n-api-consent-screen-input-section">
													<div style="display: inline-block; width: 190px;">
														<div class="p6n-api-consent-screen-label">TIPO
															DOCUMENTO</div>
														<div>
															<h:selectOneMenu id="cmbTipodocumentoPersonajuridica"
																value="#{aperturaCuentaaporteBean.comboTipodocumentoPersonajuridica.itemSelected}"
																valueChangeListener="#{aperturaCuentaaporteBean.changeTipodocumentoPersonajuridica}"
																required="true"
																requiredMessage="Seleccione tipo de documento">
																<f:selectItem itemLabel="--SELECCIONE--" itemValue="" />
																<f:selectItems
																	value="#{aperturaCuentaaporteBean.comboTipodocumentoPersonajuridica.items.entrySet()}"
																	var="val" itemLabel="#{val.value.abreviatura}"
																	itemValue="#{val.key}" />
																<f:ajax></f:ajax>
															</h:selectOneMenu>
														</div>
													</div>
													<div style="display: inline-block; width: 190px;">
														<div class="p6n-api-consent-screen-label">NUMERO
															DOCUMENTO</div>
														<div>
															<h:inputText id="txtNumerodocumentoPersonajuridica" autocomplete="off"
																value="#{aperturaCuentaaporteBean.numeroDocumentoPersonajuridica}"
																required="true" maxlength="11"
																requiredMessage="Ingrese numero documento"
																validatorMessage="Número de documento Invalido"
																onkeypress="if (event.keyCode == 13) {onchange(); return false; }">
																<f:validateRegex pattern="(^[0-9]{11}$)" />
																<f:ajax
																	listener="#{aperturaCuentaaporteBean.buscarPersonajuridicaSocio()}"
																	render="txtTazonsocial txtNombrecomercial txtActividadprincipal txtFechaconstitucion cmbTipoempresa cmbFinsocial txtDireccion txtReferencia txtTelefono txtCelular txtEmail"></f:ajax>
															</h:inputText>
														</div>
													</div>
												</div>
												<div
													class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
													<h:message for="cmbTipodocumentoPersonajuridica" />
													<h:message for="txtNumerodocumentoPersonajuridica" />
												</div>
												<div class="p6n-api-consent-screen-input-section">
													<div style="display: inline-block; width: 190px;">
														<div class="p6n-api-consent-screen-label">RAZON
															SOCIAL</div>
														<div>
															<div>
																<h:inputText id="txtTazonsocial" autocomplete="off"
																	value="#{aperturaCuentaaporteBean.razonSocial}"
																	required="true" maxlength="50"
																	requiredMessage="Ingrese la razon social"
																	onkeyup="this.value = this.value.toUpperCase();">
																</h:inputText>
															</div>
														</div>
													</div>
													<div style="display: inline-block;">
														<div class="p6n-api-consent-screen-label">NOMBRE
															COMERCIAL</div>
														<div>
															<div>
																<h:inputText id="txtNombrecomercial" autocomplete="off"
																	value="#{aperturaCuentaaporteBean.nombreComercial}"
																	maxlength="50"
																	onkeyup="this.value = this.value.toUpperCase();">
																</h:inputText>
															</div>
														</div>
													</div>
												</div>
												<div
													class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
													<h:message for="txtTazonsocial" />
													<h:message for="txtNombrecomercial" />
												</div>
												<div class="p6n-api-consent-screen-input-section">
													<div style="display: inline-block; width: 190px;">
														<div class="p6n-api-consent-screen-label">ACTIVIDAD
															PRINCIPAL</div>
														<div>
															<div>
																<h:inputText id="txtActividadprincipal" autocomplete="off"
																	value="#{aperturaCuentaaporteBean.actividadPrincipal}"
																	maxlength="50"
																	onkeyup="this.value = this.value.toUpperCase();">
																</h:inputText>
															</div>
														</div>
													</div>
													<div style="display: inline-block;">
														<div class="p6n-api-consent-screen-label">FECHA
															CONSTITUCION</div>
														<div>
															<div>
																<p:calendar id="txtFechaconstitucion" autocomplete="off"
																	value="#{aperturaCuentaaporteBean.fechaConstitucion}"
																	navigator="true" pattern="dd/MM/yyyy" required="true"
																	requiredMessage="Ingrese Fecha de constitucion"
																	converterMessage="El formato de la fecha no es correcto">
																	<f:convertDateTime pattern="dd/MM/yy" timeZone="EST" />
																</p:calendar>
															</div>
														</div>
													</div>
												</div>
												<div
													class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
													<h:message for="txtActividadprincipal" />
													<h:message for="txtFechaconstitucion" />
												</div>
												<br />
												<div class="sf-separator">
													<h3 class="p6n-api-consent-screen-title"
														style="color: #298B11;">Datos Comerciales</h3>
												</div>
												<div class="p6n-api-consent-screen-input-section">
													<div style="display: inline-block; width: 190px;">
														<div class="p6n-api-consent-screen-label">TIPO
															EMPRESA</div>
														<div>
															<div>
																<h:selectOneMenu id="cmbTipoempresa"
																	value="#{aperturaCuentaaporteBean.comboTipoempresa.itemSelected}"
																	required="true" requiredMessage="Ingrese tipo empresa">
																	<f:selectItem itemLabel="--Seleccione--" itemValue="" />
																	<f:selectItems
																		value="#{aperturaCuentaaporteBean.comboTipoempresa.items.entrySet()}"
																		var="val" itemLabel="#{val.value.denominacion}"
																		itemValue="#{val.key}" />
																</h:selectOneMenu>
															</div>
														</div>
													</div>
													<div style="display: inline-block;">
														<div class="p6n-api-consent-screen-label">FIN SOCIAL</div>
														<div>
															<div>
																<h:selectOneMenu id="cmbFinsocial"
																	value="#{aperturaCuentaaporteBean.comboFinsocial.itemSelected}">
																	<f:selectItem itemLabel="--Seleccione--" itemValue="" />
																	<f:selectItems
																		value="#{aperturaCuentaaporteBean.comboFinsocial.items.entrySet()}"
																		var="val" itemLabel="#{val.value}"
																		itemValue="#{val.key}" />
																</h:selectOneMenu>
															</div>
														</div>
													</div>
												</div>
												<div
													class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
													<h:message for="cmbTipoempresa" />
													<h:message for="cmbFinsocial" />
												</div>
												<br />
												<div class="sf-separator">
													<h3 class="p6n-api-consent-screen-title"
														style="color: #298B11;">Datos Adicionales</h3>
												</div>
												<div class="p6n-api-consent-screen-input-section">
													<div style="display: inline-block; width: 190px;">
														<div class="p6n-api-consent-screen-label">DIRECCION</div>
														<div>
															<div>
																<h:inputText id="txtDireccion" autocomplete="off"
																	value="#{aperturaCuentaaporteBean.direccionPersonajuridica}"
																	onkeyup="this.value = this.value.toUpperCase();">
																</h:inputText>
															</div>
														</div>
													</div>
													<div style="display: inline-block;">
														<div class="p6n-api-consent-screen-label">REFERENCIA</div>
														<div>
															<div>
																<h:inputText id="txtReferencia" autocomplete="off"
																	value="#{aperturaCuentaaporteBean.referenciaPersonajuridica}"
																	onkeyup="this.value = this.value.toUpperCase();">
																</h:inputText>
															</div>
														</div>
													</div>
												</div>
												<div class="p6n-api-consent-screen-input-section">
													<div style="display: inline-block; width: 190px;">
														<div class="p6n-api-consent-screen-label">TELEFONO</div>
														<div>
															<div>
																<h:inputText id="txtTelefono" autocomplete="off"
																	value="#{aperturaCuentaaporteBean.telefonoPersonajuridica}">
																</h:inputText>
															</div>
														</div>
													</div>
													<div style="display: inline-block;">
														<div class="p6n-api-consent-screen-label">CELULAR</div>
														<div>
															<div>
																<h:inputText id="txtCelular" autocomplete="off"
																	value="#{aperturaCuentaaporteBean.celularPersonajuridica}">
																</h:inputText>
															</div>
														</div>
													</div>
												</div>
												<div class="p6n-api-consent-screen-input-section">
													<div class="p6n-api-consent-screen-label">EMAIL</div>
													<div>
														<div>
															<h:inputText id="txtEmail" autocomplete="off"
																onkeyup="this.value = this.value.toUpperCase();"
																value="#{aperturaCuentaaporteBean.emailPersonajuridica}"
																style="width:339px;" />
														</div>
													</div>
												</div>
												<br /> <br />
												<div class="sf-buttons" style="float: left;">
													<h:commandButton value="Cancelar"
														action="/caja/index?faces-redirect=true"
														immediate="true" styleClass="action" />
													<h:commandButton value="Siguiente »"
														action="aperturaCuentaaporte-flowA.xhtml"
														styleClass="action green" />
												</div>
											</div>
										</div>
									</div>
								</div>
							</h:form>
						</div>
					</h:panelGroup>
				</h:panelGroup>
			</div>
		</ui:define>

	</ui:composition>
</f:view>
</html>